<%@ include file="/common/common.jsp"%>
<%@ page language="java" pageEncoding="UTF-8"%>
<head>
    <script type="text/javascript" src="<%=jsPath%>/util/echarts.js?v=8503021"></script><!--图表插件-->

<style>

/*上层弹性填充块样式*/
.rep_chart_dri_topCss{
    /* border:1px solid red; */
    width:100%;
    flex-grow: 1;
    /* height:calc(100% - 230px); */
    overflow: auto;
}

/*下层图表层样式*/
.rep_chart_dri_divCss{
    /* border:1px solid blue; */
    width:100%;
    height:230px;
}
.rep_chart_dri_divCss > div{
    width:33%;
    height:98%;
    border:1px solid rgb(210,210,210);
    border-radius: 2px;
}

</style>

<script>
 
$(function () {
    $("#rep_chart_dri_mainGrid").datagrid(
        rep_chart_dri.datagridTemplete
    );
});
///////////////////////////////////////////////////////////////////////变量
var rep_chart_dri = {};//功能对象
rep_chart_dri.debug = true;
//饼状图样式模板
rep_chart_dri.chartOptionTemp = 
{
    title: { text: '报警数量', textStyle: { fontSize: 13, }, },
    tooltip: { trigger: 'item', formatter: "{a} <br/>{b}: {c} ({d}%)" },
    series: [
        {
            name: '报警数量',
            type: 'pie',
            radius: ['0%', '60%'],
            label: {
                normal: {
                    formatter: ' {b|{b}：}{c}  {per|{d}%}  ',
                    backgroundColor: '#eee',
                    borderColor: '#aaa',
                    borderWidth: 1,
                    borderRadius: 2,
                    rich: {
                        b: {
                            fontSize: 13,
                            lineHeight: 33
                        },
                        per: {
                            color: '#eee',
                            backgroundColor: '#334455',
                            padding: [2, 4],
                            borderRadius: 2
                        }
                    }
                }
            },
            data: [

            ]
        }
    ]
};

//数据表格初始化模板
rep_chart_dri.datagridTemplete = {
    // height: "100%",
    // toolbar: '#rep_chart_dri_mainGrid_toolbar',
    pagination: true,//分页工具栏
    pageList: [15, 30, 50, 100],
    pageSize: 15,
    singleSelect: true,//单选
    rownumbers: true,//行号
    striped: true,//隔行变色
    fitColumns: false,//列的尺寸自动缩放
    checkOnSelect: false,//选中则勾选
    selectOnCheck: false,//勾选则选中
};

rep_chart_dri.alarmMap = {};//报警类型描述map
rep_chart_dri.alarmList = null;//报警类型描述列表
//缓存，用于保存解析后的数据
rep_chart_dri.cache = {};
rep_chart_dri.cache.data = {};
rep_chart_dri.cache.fieldList = [];//列名保存列表

rep_chart_dri.chartLevel = null;//报警级别图表
rep_chart_dri.chartAdas = null;
rep_chart_dri.chartDsm = null;
///////////////////////////////////////////////////////////////////////初始化数据
//接口，初始化数据
rep_chart_dri.initDatas = function(){
    this.initAlarmTypeNamesData();
    this.initChartObj();
}

//初始化报警类型描述数据
rep_chart_dri.initAlarmTypeNamesData = function(){
    let me = this;
    let str = window.localStorage.getItem('alarmSourceList');
    if(str != ""){
        let list = JSON.parse(str);
        if(list.length > 0){
            me.alarmList = list;
            for(let i=0 ; i<list.length ; i++){
                let key = list[i].alarmSource + '_' + list[i].alarmType;
                me.alarmMap[key] = list[i];
            }
        }
    }
}

//初始化报警图表对象
rep_chart_dri.initChartObj = function(){
    if(this.chartLevel == null){
        this.chartLevel = echarts.init(document.getElementById('rep_chart_dri_echart_level'));
    }
    if(this.chartAdas == null){
        this.chartAdas = echarts.init(document.getElementById('rep_chart_dri_echart_adas'));
    }
    if(this.chartDsm == null){
        this.chartDsm = echarts.init(document.getElementById('rep_chart_dri_echart_dsm'));
    }
}

///////////////////////////////////////////////////////////////////////控件初始化
//接口，初始化插件
rep_chart_dri.initDivs = function(){
    this.initDepDiv();
    this.initTimeDiv();
    this.initGridEvent();
    this.initGridClickEvent();
    this.initLevelDiv();//报警等级
    this.initAlarmTypeDiv();
}

//初始化车组
rep_chart_dri.initDepDiv = function () {
    //创建下拉部门树
    Utility.createDepTree("rep_chart_dri_depId");
}

//初始化时间控件
rep_chart_dri.initTimeDiv = function(){
    let today = Utility.today();
    $("#rep_chart_dri_startTime").datebox('setValue',today + ' 00:00:00');
    $("#rep_chart_dri_endTime").datebox('setValue',today + ' 23:59:59');
}

//初始化数据表格事件
rep_chart_dri.initGridEvent = function(){
    let me = this;
    $("#rep_chart_dri_mainGrid").datagrid("getPager").pagination({
		onSelectPage:function(pageNumber,pageSize){
            // rep_chart_dri.outDebug("开始选择页面:number="+ pageNumber + " , size = " + pageSize);
			rep_chart_dri.getAllDatas(pageNumber,pageSize);	
		}
    });
}

//初始化数据表格单击行事件
rep_chart_dri.initGridClickEvent = function(){
    let me = this;
    $("#rep_chart_dri_mainGrid").datagrid({
        onClickRow : function(rowIndex,rowData){
            //单击一行事件
            me.showOneDepData2Chart(rowData);
		}
    });
}

//初始化报警级别
rep_chart_dri.initLevelDiv = function(){
    let data = [
        {name:'请选择',value:""},
        {name:'一级',value:"1"},
        {name:'二级',value:"2"},
    ];
    $("#rep_chart_dri_level").combobox({
        textField: "name",
        valueField: "value",
        data: data,
        select: data[0].value
    })
}

//初始化报警类型控件
rep_chart_dri.initAlarmTypeDiv = function(){
    if(this.alarmList != null){
        let data = [{name:'请选择',value:''}];
        let list = [];
        for(let i=0 ; i<this.alarmList.length ; i++){
            let item = this.alarmList[i];
            if(item.alarmSource == 'adas_alarm' || item.alarmSource == 'adas_driver_state_alarm')
            {
                let key = item.alarmSource + '---' + item.alarmType;
                if(list.indexOf(key) < 0){
                    list.push(key);
                    data.push({name:item.alarmTypeName,value:key});
                }
            }
        }
        $("#rep_chart_dri_alarmType").combobox({
            textField: "name",
            valueField: "value",
            data: data,
            select: data[0].value
        });
    }
}

///////////////////////////////////////////////////////////////////////方法

//查询到方法
rep_chart_dri.getAllDatas = function(pageNumber,pageSize){
    let me = this;
    let param = this.getQueryParam(pageNumber,pageSize);
    if(pageNumber == '1'){
        me.setGridPageNumber(pageNumber);//设置为首页
    }
    // me.outDebug("查询参数为：" , param);
    if(param.message == ""){
        Utility.showLoading();
        let url = globalConfig.webPath + "/basicSlctAction/selectPaginationDataByAuth.action";
        Utility.getAjaxData(url,JSON.stringify(param),function(data){
            // me.outDebug("接收到分析表基本数据：",data);
            if(data.success){
                let result = {};
                if(!DataUtil.isDefined(data.data)){
                    if(!DataUtil.isDefined(data.data.rows)){
                        result = me.formatAlarmDatas(data.data,pageNumber);
                        // me.outDebug("解析后的数据为：" , result);
                        $("#rep_chart_dri_mainGrid").datagrid('loadData',result);
                        //初始化之后，重新设置页面和设置页面选择事件
                        me.setGridPageNumber(pageNumber);
                        me.initGridEvent();//重新初始化页面选择事件
                        me.showFirstLineInfo();
                    }
                }
            }else{
                DataUtil.showErrorMsg(data.message);
            }
            Utility.hideLoading();
        });
    }else{
        DataUtil.showErrorMsg(param.message);
    }
}

//获取查询参数
rep_chart_dri.getQueryParam = function(pageNumber,pageSize){
    let param = DataUtil.getParamFromForm('rep_chart_dri_mainGrid_toolbar');
    if(!DataUtil.isDefined(param.startTime)){
        param.startTime += ' 00:00:00';
    }

    if(!DataUtil.isDefined(param.endTime)){
        param.endTime += ' 23:59:59';
    }

    if(!DataUtil.isDefined(param.alarmType)){
        let list = param.alarmType.split('---');
        if(list.length > 1){
            param.alarmSource = list[0];
            param.alarmType = list[1];
        }else{
            delete param.alarmType;
        }
    }

    param.queryId = "alarmReport.selectAlarmcountDataGroupByDriverFromAdasAlarm";

    if(isNaN(pageNumber)){
        param.pageNumber =  $("#rep_chart_dri_mainGrid").datagrid("getPager").data("pagination").options.pageNumber;
    }else{
        param.pageNumber = pageNumber;
    }

    if(isNaN(pageSize)){
        param.pageSize = $("#rep_chart_dri_mainGrid").datagrid("getPager").data("pagination").options.pageSize;
    }else{
        param.pageSize = pageSize;
    }
    return param;
};


//解析报警数据
rep_chart_dri.formatAlarmDatas = function(data,pageNumber){
    let me = this;
    let result = {
        total:0,
        rows:[],
    };
    me.cache.fieldList = [];
    if(data.total > 0){
        //保存数量值
        result.total = data.total;
        //解析数据
        $.each(data.rows,function(n,item){
            //创建解析后的数据对象
            let obj = {
                driverName:item.driverName,//驾驶员
                total:item.total,
                totalNum:0,//报警总数
                level1Num:0,//一级报警数量
                level2Num:0,//二级报警数量
                alarmDatas:item.alarmDatas,//原报警数据,用于核对
            };
            //解析数据,驾驶员为单位
            let alarmList = item.alarmDatas.split(',');
            if(alarmList.length > 0){
                for(let i=0 ; i<alarmList.length ; i++){
                    me.formatOneAlarmTypeData(alarmList[i],obj);
                }
            }
            //开始解析图表所需数据
            me.formatOnePlateNoChartData(obj)
            result.rows.push(obj);
        });

        //解析后进行后续处理,格式化数据表格列
        me.formatGridColums(pageNumber);
    }

    return result;
}

//解析单个驾驶员的报警数据，并且更新数据到对象中
rep_chart_dri.formatOneAlarmTypeData = function(str,obj){
    let me = this;
    let list = str.split('---');
    if(list.length > 3){//4条数据为解析成功，否则为解析失败
        // me.outDebug("解析后的单个报警数据：",list);
        //解析显示数据
        me.formatOneAlarmShowData(list,obj);
    }
}

//解析单个车辆的需要显示的报警数据
rep_chart_dri.formatOneAlarmShowData = function(list,obj){
    let me = this;
    let key = list[0] + '_' + list[1];//source + type
    //判断字段列表中是否有该值
    if (me.cache.fieldList.indexOf(key) < 0) {
        me.cache.fieldList.push(key);
    }
    //更新该报警类型数量
    let num = isNaN(parseInt(list[3])) ? 0 : parseInt(list[3]);
    if (isNaN(obj[key])) {
        //不存在该报警类型
        obj[key] = num;
    } else {
        //该报警类型已经存在
        obj[key] += num;
    }

    //更新报警级别数量
    if (list[2] == '1') {
        obj.level1Num += num;
    } else if (list[2] == '2') {
        obj.level2Num += num;
    }
    //更新报警总数
    obj.totalNum += num;
}

//解析单个车组的需要显示图标的数据
rep_chart_dri.formatOnePlateNoChartData = function(obj){
    let me = this;
    let adasList = [];//adas报警列表
    let dsmList = [];//dsm报警列表
    //解析报警明细
    for(key in obj){
        if(key.indexOf('adas') > -1){
            let alarmTypeName = me.getAlarmTypeName(key);
            // me.outDebug('key = ' + key + ' , value = ' + obj[key] + " ,alarmTypeName = " + alarmTypeName);
            let item = {
                name: alarmTypeName,
                value: obj[key]
            };
            if(key.indexOf('adas_alarm') > -1){
                //主动安全报警
                adasList.push(item);
            }else if(key.indexOf('adas_driver_state_alarm') > -1){
                //dsm报警
                dsmList.push(item);
            }
        }
    }
    obj.adasList = adasList;
    obj.dsmList = dsmList;

    //解析报警级别数据
    obj.levList = [
        {name:'一级',value:obj.level1Num},
        {name:'二级',value:obj.level2Num},
    ];
}

//格式化数据表格列
rep_chart_dri.formatGridColums = function(pageNumber){
    let me = this;
    let columns = [[
        { title: '驾驶员', field: 'driverName', width: 110, minWidth: 80 },
        { title: '报警总数', field: 'totalNum', width: 90, minWidth: 80 },
    ]];
   
    if(me.cache.fieldList.length > 0){
        let len = me.cache.fieldList.length;
        for(let i=0 ;i< len ; i++){
            let key = me.cache.fieldList[i];
            //描述文字
            let alarm = me.alarmMap[key];
            let str = DataUtil.isDefined(alarm) ? key : alarm.alarmTypeName;

            let obj = {
                title:str,
                field:key,
                width:90,
                minWidth:70,
            };
            columns[0].push(obj);
        }
    }
    // columns[0].push({ title: '数据', field: 'alarmDatas', width: 110, minWidth: 80 });
    // me.outDebug("字段列表数据：",columns);
    $("#rep_chart_dri_mainGrid").datagrid({columns:columns});
}


//获取报警类型描述
rep_chart_dri.getAlarmTypeName = function(key){
    let str = key;
    let alarm = rep_chart_dri.alarmMap[key];
    if(!DataUtil.isDefined(alarm)){
        str = alarm.alarmTypeName;
    }
    return str;
}

//显示第一行的信息
rep_chart_dri.showFirstLineInfo = function(){
    let rowDatas = $("#rep_chart_dri_mainGrid").datagrid('getRows');
    this.outDebug("rowDatas" , rowDatas);
    if(rowDatas.length > 0){
        $("#rep_chart_dri_mainGrid").datagrid('selectRow',0);
        this.showOneDepData2Chart(rowDatas[0]);
    }
}

///////////////////////////////////////////////////////////////////////控件事件

//显示行数据到图表
rep_chart_dri.showOneDepData2Chart = function(rowData){
    let me = this;
    // me.outDebug("rowData:",rowData);
    if (!DataUtil.isDefined(rowData.levList)) {
        me.chartOptionTemp.title.text = '报警等级分布';
        me.chartOptionTemp.series[0].name = '报警级别';
        me.chartOptionTemp.series[0].data = rowData.levList;
        //使用制定的配置项和数据显示图表
        if(me.chartLevel != null){
            me.chartLevel.setOption(this.chartOptionTemp);
        }
    }
    if (!DataUtil.isDefined(rowData.adasList)) {
        me.chartOptionTemp.title.text = 'ADAS报警分布';
        me.chartOptionTemp.series[0].name = '报警数量';
        me.chartOptionTemp.series[0].data = rowData.adasList;
        //使用制定的配置项和数据显示图表
        if(me.chartAdas != null){
            me.chartAdas.setOption(this.chartOptionTemp);
        }
    }
    if (!DataUtil.isDefined(rowData.dsmList)) {
        me.chartOptionTemp.title.text = 'DSM报警分布';
        me.chartOptionTemp.series[0].name = '报警数量';
        me.chartOptionTemp.series[0].data = rowData.dsmList;
        //使用制定的配置项和数据显示图表
        if(me.chartDsm != null){
            me.chartDsm.setOption(this.chartOptionTemp);
        }
    }
}


///////////////////////////////////////////////////////////////////////公共方法
rep_chart_dri.outDebug = function(msg,data){
    if(this.debug == true){
        DataUtil.outDebug(msg,data);
    }
}

//设置为指定页面
rep_chart_dri.setGridPageNumber = function(pageNumber){
    DataUtil.setGridFirstPage('rep_chart_dri_mainGrid',pageNumber);
}


///////////////////////////////////////////////////////////////////////加载后执行
$(document).ready(function(){
    rep_chart_dri.initDatas();//初始化数据;
    rep_chart_dri.initDivs();//初始化控件   
});



</script>




</head>
<body class="sh_body_Css">
    <div class="sh_body_first_par_div base_ver_spaceBetweenDiv_css" >
        <form id="rep_chart_dri_mainGrid_toolbar" class="base_hori_flexStartDiv_css" style="padding:5px;width:100%;">
            <span style="margin-left:10px;">车组：</span>
            <select id="rep_chart_dri_depId" name="depId" style="width:180px;"></select>
            &nbsp;&nbsp;
            <span>驾驶员：</span>
            <input type="text" name="driverName" style="width:80px;">
            &nbsp;&nbsp;
            <span>起止时间：</span>
            <input type="text" id="rep_chart_dri_startTime" name="startTime" class="easyui-datebox" style="width:100px;">
            <span>-</span>
            <input type="text" id="rep_chart_dri_endTime" name="endTime" class="easyui-datebox" style="width:100px;">
            &nbsp;&nbsp;
            <span>报警等级：</span>
            <select id="rep_chart_dri_level" name="level" style="width:80px;"></select>
            &nbsp;&nbsp;
            <span>报警类型：</span>
            <select id="rep_chart_dri_alarmType" name="alarmType" style="width:130px;"></select>
            <div class="sh_css_btn" style="margin-left:15px;" onclick="rep_chart_dri.getAllDatas(1);">
                <div class="ui-icon icon-ok" style="width:16px;height:16px;"></div>
                <span>查询</span>
            </div>
        </form>
        <div class="rep_chart_dri_topCss">
            <table id="rep_chart_dri_mainGrid" class="easyui-datagrid" style="width:100%;height:100%;">
                <thead>
                    <tr>
                        <th data-options="field:'id',checkbox:true"><input type='checkbox' id='selectAll'></input></th>
                        <th data-options="field:'driverName'" width="100">驾驶员</th>
                        <th data-options="field:'alarmDatas'" width="170">数据</th>
                        <th data-options="field:'remark'" width="350">备注</th>
                    </tr>
                </thead>
            </table>
        </div>
        <div class="base_hori_spaceAroundDiv_css rep_chart_dri_divCss" >
            <div id="rep_chart_dri_echart_level"></div>
            <div id="rep_chart_dri_echart_adas"></div>
            <div id="rep_chart_dri_echart_dsm"></div>
        </div>
    </div>
    <!--
        <span>测试</span>
                
    -->
</body>